<template>
  <view class="content">
    <view class="content-list">
      <view v-for="(item, index) in goodsList" :key="index" @tap="toGoodDetail(item.goods_id)">
      <goodsItem :item="item"></goodsItem>
      </view>
    </view>

  </view>
</template>

<script>
  import {
    API_SearchList
  } from '@/api/API.js'
  import {
    NAV_TO,
    TOAST_SHOW_FAIL
  } from '@/utils/view_utils.js'
  export default {
    data() {
      return {
        // 请求参数对象
        queryObj: {
          query: '', //关键字
          cid: '', // 分类id
          pagenum: 1, // 页码
          pagesize: 10 // 页容量
        },
        // 商品列表数据
        goodsList: [],
        total: 0, // 商品总数量
        isLoading: false, // 是否在请求数据
      };
    },
    onLoad(options) {
      this.queryObj.query = options.query || '';
      this.queryObj.cid = options.cid || '';
      // 请求商品列表
      this.getGoodsList();
    },
    methods: {
      async getGoodsList(back) {
        this.isLoading = true;
        const {
          data: res
        } = await API_SearchList(this.queryObj);
        this.isLoading = false;
        // 数据加载完毕后 调回调函数
        back && back();
        if (res.meta.status !== 200) return TOAST_SHOW_FAIL('请求商品列表失败！');
        this.goodsList = [...this.goodsList, ...res.message.goods];
        this.total = res.message.total;
      },
      // 点击商品区域跳转到详情页
      toGoodDetail(goods_id) {
        NAV_TO('/subpkg/goods_detail/goods_detail',{
          goods_id,
        })
      }
    },
    // 监听上拉加载
    onReachBottom() {
      if(this.isLoading) return;
      if(this.queryObj.pagenum * this.queryObj.pagesize >= this.total) return TOAST_SHOW_FAIL('商品加载完毕')
      this.queryObj.pagenum++;
      this.getGoodsList();
    },
    // 监听下拉刷新
    onPullDownRefresh() {
      this.queryObj.pagenum = 1;
      this.total = 0;
      this.isLoading = false;
      this.goodsList = [];
      this.getGoodsList(()=>{
        uni.stopPullDownRefresh();
      })
    }
  }
</script>

<style lang="scss">
.content {
  &-list {
 
  }
}
</style>
